import React, { useState } from 'react';
import { Typography } from 'antd';
import TopMenu from '../../components/layout/TopMenu';
import DocumentManager from './DocumentManager';
import { BookOutlined, FileTextOutlined, FileImageOutlined, FileUnknownOutlined } from '@ant-design/icons';

const { Title } = Typography;

const FileManageCenterPage: React.FC = () => {
  const [currentMenuKey, setCurrentMenuKey] = useState('regulation');

  // 顶部菜单配置
  const topMenuItems = [
    { 
      key: 'regulation',
      label: '规范',
      icon: <BookOutlined />
    },
    {
      key: 'literature',
      label: '文献',
      icon: <FileTextOutlined />
    },
    {      
      key: 'blueprint',
      label: '蓝图',
      icon: <FileImageOutlined style={{ color: '#1890ff' }} />
    },
    {
      key: 'other',
      label: '其他',
      icon: <FileUnknownOutlined style={{ color: '#722ed1' }} />
    },
  ];

  const handleMenuClick = (key: string) => {
    setCurrentMenuKey(key);
  };

  return (
    <div>
      <Title level={2}>规范文件</Title>
      
      <div style={{ marginBottom: '24px', overflow: 'hidden' }}>
        <TopMenu 
          currentKey={currentMenuKey}
          onChange={handleMenuClick}
          items={topMenuItems}
        />
      </div>

      {currentMenuKey === 'regulation' && (
        <DocumentManager
          title="规范中心"
          category="工程标准规范"
          addButtonText="添加自定义规范"
          emptyText='暂无规范文件，请点击"添加自定义规范"按钮添加'
          uploadHint="点击或拖拽上传规范文件"
          localStorageKey="regulationStates"
          type="regulation"
        />
      )}
      
      {currentMenuKey === 'literature' && (
        <DocumentManager
          title="文献中心"
          category="工程标准文献"
          addButtonText="添加自定义文献"
          emptyText='暂无文献文件，请点击"添加自定义文献"按钮添加'
          uploadHint="点击或拖拽上传文献"
          localStorageKey="regulationStates"
          type="literature"
        />
      )}
      
      {currentMenuKey === 'blueprint' && (
        <DocumentManager
          title="蓝图中心"
          category="工程标准蓝图"
          addButtonText="添加自定义蓝图"
          emptyText='暂无蓝图文件，请点击"添加自定义蓝图"按钮添加'
          uploadHint="点击或拖拽上传蓝图文件"
          localStorageKey="regulationStates"
          type="blueprint"
        />
      )}
      
      {currentMenuKey === 'other' && (
        <DocumentManager
          title="其他文件中心"
          category="工程其他文件"
          addButtonText="添加其他文件"
          emptyText='暂无其他文件，请点击"添加其他文件"按钮添加'
          uploadHint="点击或拖拽上传其他类型文件"
          localStorageKey="regulationStates"
          type="other"
        />
      )}
    </div>
  );
};

export default FileManageCenterPage;
